<template>
  <div class="common-layout">
	<el-container>
	  <el-header>
		  <h1>你好，彭于晏</h1></el-header> 
	  <el-container>
		<el-aside width="200px">
      
			<el-menu :router="true">
			<el-menu-item index="/books">
				<template #title > 商品管理  </template>  
			</el-menu-item>
			<el-menu-item index="/dingdan">
				<template #title>订单管理</template>
			</el-menu-item>
			<el-menu-item index="/carts">
				<template #title>购物车管理</template>
			</el-menu-item>
			<el-menu-item index="/vip">
				<template #title>会员管理</template>
			</el-menu-item>
			</el-menu>
			
		 <img 
		   src="https://img2.baidu.com/it/u=1835668870,1764494306&fm=253&fmt=auto&app=120&f=JPEG?w=800&h=800" 
		   width="120" 
		   height="120" 
		   alt="图片描述"
		 />

		   </el-aside>
		<el-container>
		  <router-view></router-view>
		  <el-footer>Footer</el-footer>
		</el-container>
	  </el-container>
	</el-container>
  </div>
 
</template>

<style>
.el-aside{
	text-align: center;
}
.el-menu-item{
	font-weight: 1000;
	font-size:20px
	
}

</style>
<script setup>
import { onMounted } from 'vue';
import { useRouter } from 'vue-router';

const router = useRouter();

onMounted(() => {
  // 页面加载时跳转到商品管理页面
  router.push('/books');
});

</script>













